import React, { PropTypes } from 'react'
import { routerRedux } from 'dva/router'
import { connect } from 'dva'
import { Spin } from 'antd'
import StatsBasicList from '../components/stats/basic/list'
import StatsBasicHeader from '../components/stats/basic/header'
import Chart from '../components/stats/basic/chart'


function StatsBasic ({ location, dispatch, app,statsBasic }) {
  const {login}=app;
  const {loading,list, pagination, stations,activeMenu,timestamp } = statsBasic;
  let { stationCode, startAt,endAt,type } = location.query;

  const statsBasicListProps = {
    dataSource: list,
    loading,
    type:activeMenu
  };

  const statsBasicHeaderProps = {
    stationCode,
    startAt,
    endAt,
    stations,
    onSearch(fieldsValue){
       dispatch({
        type: 'statsBasic/query',
        payload:{
          ...fieldsValue
        }
      })
    }
  };
  const chartProps={
     dataSource: list,
     activeMenu:activeMenu,
     timestamp:timestamp
  };
  return (
    <div className='content-inner'>
      <Spin tip='loading...' spinning={loading} size='large'>
      <StatsBasicHeader {...statsBasicHeaderProps} />
      <Chart {...chartProps}/>
      <StatsBasicList {...statsBasicListProps} />
      </Spin>
    </div>
  )
}

StatsBasic.propTypes = {
  statsBasic: PropTypes.object,
  location: PropTypes.object,
  dispatch: PropTypes.func
};

function mapStateToProps ({ app,statsBasic }) {
  return { app,statsBasic }
}

export default connect(mapStateToProps)(StatsBasic)
